{extend name="public/base" /}
{block name="content"}
<form class="layui-form layui-form-pane form-search" action="{:url()}" onsubmit="return false" method="post" autocomplete="off">
    <div class="layui-form-item layui-inline">
        <label class="layui-form-label">文件类型</label>
        <div class="layui-input-inline">
            <select name="status" lay-search class="layui-select">
                <option value='0'>全部</option>
                {volist name="Think.config.global.FILE_UPLOAD_LIST" id="type" }
                <option value="{$key}">{$type}</option>
                {/volist}
            </select>
        </div>
    </div>
    <div class="layui-form-item layui-inline">
        <label class="layui-form-label">上传模块</label>
        <div class="layui-input-inline">
            <select name="module" lay-search class="layui-select">
                <option value='0'>全部</option>
                {volist name="Think.config.global.MODULE_MAPPING" id="module" }
                <option value="{$key}">{$module}</option>
                {/volist}
            </select>
        </div>
    </div>
    <div class="layui-form-item layui-inline">
        <label class="layui-form-label">用户id</label>
        <label class="layui-input-inline">
            <input name="uid" value="" placeholder="" class="layui-input">
        </label>
    </div>
    <div class="layui-form-item layui-inline">
        <label class="layui-form-label">上传时间</label>
        <div class="layui-input-inline">
            <input data-date-range name="create_at" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-inline">
        <button class="layui-btn layui-btn-primary"><i class="layui-icon">&#xe615;</i>搜索</button>
    </div>
</form>
<table id="FileTable"  data-url="{:url('index')}" data-target-search="form.form-search"></table>
{/block}
{block name='script'}
<script>
    var file_type=JSON.parse(`{$file_type|raw}`);
    var module_list = JSON.parse(`{$module_list|raw}`)
</script>
<script>
    $(function () {
        $.menu.highlight_subnav("{:url('index')}")
        $('#FileTable').layTable({
            even: true,
            height: 'full',
            sort: {field: 'id', type: 'desc'},
            url: "{:url('index')}" ,
            method: 'post',
            cols: [[
                {checkbox: true, fixed: true},
                {field: 'id', title: 'ID', width: 80, align: 'center', sort: true},
                {field: 'name', title: '文件名称', width: '12%', align: 'center'},
                {field: 'hash', title: '文件哈希', width: '15%', align: 'center', templet: '<div><code>{{d.hash}}</code></div>'},
                {field: 'size', title: '文件大小', align: 'center', width: '7%', sort: true, templet: '<div>{{-$.formatFileSize(d.size)}}</div>'},
                {field: 'ext', title: '文件后缀', align: 'center', width: '7%', sort: true},
                {
                    field: 'url', title: '查看文件', width: '7%', align: 'center', templet: function (d) {
                        if (typeof d.mime === 'string' && /^image\//.test(d.mime)) {
                            return laytpl('<div><a target="_blank" data-tips-hover data-tips-image="{{d.url}}"><i class="layui-icon layui-icon-picture"></i></a></div>').render(d)
                        }
                        if (typeof d.mime === 'string' && /^video\//.test(d.mime)) {
                            return laytpl('<div><a target="_blank" data-video-player="{{d.url}}" data-tips-text="播放视频"><i class="layui-icon layui-icon-video"></i></a></div>').render(d);
                        }
                        if (typeof d.mime === 'string' && /^audio\//.test(d.mime)) {
                            return laytpl('<div><a target="_blank" data-video-player="{{d.url}}" data-tips-text="播放音频"><i class="layui-icon layui-icon-headset"></i></a></div>').render(d);
                        }
                        return laytpl('<div><a target="_blank" href="{{d.url}}"  data-tips-text="查看下载"><i class="layui-icon layui-icon-file"></i></a></div>').render(d);
                    }
                },
                {
                    field: 'module', title: '所属模块', align: 'center', width: '8%', templet: function (d) {

                         return  module_list[d.module];
                    }
                },
                {field: 'type', title: '文件类型', align: 'center', width: '10%', templet: function (d) {

                          return  file_type[d.type];
                    }},
                {field: 'create_at', title: '创建时间', align: 'center', width: '15%', sort: true},
            ]]
        });
    });
</script>
{/block}
